import { getStyle } from '@/config/mUtils'
import { debounce } from "lodash";

export const calcSize = {
  methods: {
    calcSize(domlist) {
      let bodySize = document.body.offsetHeight
      let htmlFontSize = parseFloat(document.documentElement.style.fontSize)
      let otherSize = 0;
      domlist.forEach(element => {
        otherSize += element.offsetHeight
      });
      let res = (bodySize - otherSize) / htmlFontSize
      return res
    }
  }
}
export const loadMore = {
  directives: {
    'load-more': {
      bind: (el, binding) => {
        let windowHeight = window.screen.height;
        let height;
        let setTop;
        let paddingBottom;
        let marginBottom;
        let requestFram;
        let oldScrollTop;
        let scrollEl;
        let heightEl;
        let scrollType = el.attributes.type && el.attributes.type.value;
        let scrollReduce = 2;
        if (scrollType == 2) {
          scrollEl = el;
          heightEl = el.children[0];
        } else {
          scrollEl = document.body;
          heightEl = el;
        }

        el.addEventListener('touchstart', () => {
          height = heightEl.clientHeight;
          // if (scrollType == 2) {
          //   height = height
          // }
          setTop = el.offsetTop;
          paddingBottom = getStyle(el, 'paddingBottom');
          marginBottom = getStyle(el, 'marginBottom');
        }, false)

        el.addEventListener('touchmove', () => {
          loadMore();
        }, false)

        el.addEventListener('touchend', () => {
          oldScrollTop = scrollEl.scrollTop;
          moveEnd();
        }, false)

        const moveEnd = () => {
          requestFram = requestAnimationFrame(() => {
            if (scrollEl.scrollTop != oldScrollTop) {
              oldScrollTop = scrollEl.scrollTop;
              moveEnd()
            } else {
              cancelAnimationFrame(requestFram);
              height = heightEl.clientHeight;
              loadMore();
            }
          })
        }

        const loadMore = () => {
          if (scrollEl.scrollTop + windowHeight >= height + setTop + paddingBottom + marginBottom - scrollReduce) {
            binding.value();
          }
        }
      }
    }
  }
};

export const getImgPath = {
  methods: {
    //传递过来的图片地址需要处理后才能正常使用
    getImgPath(path) {
      let suffix;
      if (!path) {
        return '//elm.cangdu.org/img/default.jpg'
      }
      if (path.indexOf('jpeg') !== -1) {
        suffix = '.jpeg'
      } else {
        suffix = '.png'
      }
      let url = '/' + path.substr(0, 1) + '/' + path.substr(1, 2) + '/' + path.substr(3) + suffix;
      return 'https://fuss10.elemecdn.com' + url
    },
  }

}

export const backTop = {
  data() {
    return {
      showBackStatus: false,
    }
  },
  methods: {
    scrollListener: debounce(function () {
      // console.log(Object.keys(this.$refs.scroll.scroll));
      // console.log(this.$refs.scroll.scroll.y);
      if (this.$refs.scroll.scroll.y < -2000) {
        this.showBackStatus = true;
      } else {
        this.showBackStatus = false;
      }
    }, 300),
    //返回顶部
    backTop() {
      console.log("回到顶部");
      this.$refs.scroll.scrollTo(0, 0, 1000, "ease");
    },
  }
}